<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>微商城</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/swiper.min.css">
</head>
<body>
	<section class="head">
		<h1>店铺名称</h1>
		<a class="more" href="javascript:void(0);"><i class="iconfont icon-fenxiang"></i></a>
	</section>
	<section class="banner">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide">
					<div>
						<img class="box-shadow" src="images/show.png" alt="show" title="show">
					</div>
				</div>
				<div class="swiper-slide">
					<div>
						<img class="box-shadow" src="images/show.png" alt="show" title="show">
					</div>
				</div>
				<div class="swiper-slide">
					<div>
						<img class="box-shadow" src="images/show.png" alt="show" title="show">
					</div>
				</div>
			</div>
			<div class="swiper-pagination"></div>
		</div>
	</section>
	<section class="search">
		<div class="search-box big box-shadow">
			<i class="iconfont icon-sousuo"></i>
			<input type="text" placeholder="请输入商品名称">
		</div>
	</section>
	<section>
		<div class="title-box">
			<strong>热销榜单</strong>
		</div>
		<div class="hot-pro">
			<a href="javascript:void(0);"><img class="box-shadow" src="images/hot1_1.png" alt="热门产品" title="热门产品"></a>
		</div>
		<div class="hot-pro mb0">
			<a href="javascript:void(0);"><img class="box-shadow" src="images/hot1_2.png" alt="热门产品" title="热门产品"></a>
		</div>
	</section>
	<section class="product">
		<div class="title-box"><strong>商品分类1</strong></div>
		<ul class="unique clearfix">
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_1.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥299</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_2.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン男<br>装简装Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i><span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_3.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥163</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i><span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_4.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥289</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
		</ul>
		<div class="title-box"><strong>商品分类2</strong></div>
		<ul class="unique clearfix">
			<li class="bb1">
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_1.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥99</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン女<br>装内搭Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_2.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン女<br>装打底装 条纹浅白色...</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_3.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥299</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン女<br>装 针织衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_4.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン女<br>装 长衬衫ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
		</ul>
		<div class="title-box"><strong>商品分类3</strong></div>
		<ul class="unique clearfix">
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_1.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥150</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品翘边帽两色可<br>选百搭Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_2.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品クコットン女<br>装沙滩帽</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_3.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥299</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品帆布鞋三色可<br>选 新品</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_4.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p class="text-ell2">无印良品全框眼镜木制</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
		</ul>
	</section>
	<section class="footr-nav">
		<div>
			<a class="active" href="javascript:void(0);">
				<i class="iconfont icon-shouye"></i>
				<span>首页</span>
			</a>
			<a href="javascript:void(0);">
				<i class="iconfont icon-fenlei"></i>
				<span>分类</span>
			</a>
			<a href="javascript:void(0);">
				<i class="iconfont icon-gouwuche"></i>
				<span>购物车</span>
			</a>
			<a href="javascript:void(0);">
				<i class="iconfont icon-gerenzhongxin"></i>
				<span>个人中心</span>
			</a>
		</div>
	</section>
	<script src="js/jquery-1.10.2.min.js"></script>
	<script src="js/swiper.min.js"></script>
	<script src="js/common.js"></script>
</body>
</html>